<template>
  <el-menu
    default-active="2"
    class="el-menu-vertical-demo"
    background-color="#545c64"
    text-color="#fff"
    active-text-color="#ffd04b"
    router
  >
    <el-submenu v-for="(item, index) in Navlist" :index="`/${item.url}`" :key="index">
      <template slot="title">
        <i class="el-icon-location"></i>
        <span>{{ item.menu_name }}</span>
      </template>
      <el-menu-item-group>
        <el-menu-item
          v-for="subitem in item.sonmenu"
          :key="subitem.menu_id"
          :index="`/${subitem.url}`"
          >{{ subitem.menu_name }}</el-menu-item
        >
      </el-menu-item-group>
    </el-submenu>
  </el-menu>
</template>
<script>
import axios from "axios";
export default {
  data() {
    return {
      Navlist: []
   }
  },
  mounted(){
      this.getNavlist()
  },
  methods:{
    getNavlist(){
      axios.get('/api/menu').then(res =>{
        const {code,data= []} =res.data
        if(code=='00000'){
          this.Navlist =data
        }
      })
    }
  }

};



</script>
<style>

</style>